<template>
  <div class="jq-table-buttons">
    <el-button
      size="small"
      :key="item.id"
      v-for="item in tableButtons"
      :type="item.type"
      v-permission="item.perms"
      @click="item.onClick(item)"
      >{{ item.label }}</el-button
    >
  </div>
</template>

<script lang="ts" setup>
defineProps({
  tableButtons: {
    type: Array,
    required: true
  }
});
</script>

<style lang="scss" scoped>
.jq-table {
  :deep(.jq-tb-btu) {
    display: flex;
    justify-content: space-between;
    .header-l {
      display: flex;
      align-items: center;
      font-size: 15px;
      font-weight: 600;
    }
  }
  .btn-bg {
    background-color: var(--el-color-primary);
    color: #fff;
  }
}
</style>
